<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8" />
	<title>Particleground 示例</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" href="css/style.css" />
	<!-- <link href='http://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'> -->
	<!-- <script type="text/javascript" src="./jquery-1.11.1.min.js"></script> -->
	<script src="./jquery.particleground.min.js" type="text/javascript"></script>
</head>
<body>
	<div id="particles">
	  <div id="intro">
<!-- 	    <h1>Particleground</h1>
	    <p>A JavaScript plugin for snazzy background particle systems</p>
	    <a href="https://github.com/jnicol/particleground/archive/master.zip" class="btn">Download</a> -->
	  </div>
	</div>
	<script type="text/javascript">
		document.addEventListener('DOMContentLoaded', function () {
			particleground(document.getElementById('particles'), {
				dotColor: '#5cbdaa',
				lineColor: '#5cbdaa'
			});
			var intro = document.getElementById('intro');
			intro.style.marginTop = - intro.offsetHeight / 2 + 'px';
		}, false);

		// $(function () {
		// 	$('#particles').particleground({
		// 		// dotColor: '#fff',
		// 		// lineColor: '#f0f0f0'
		// 		dotColor: '#5cbdaa',
		// 		lineColor: '#5cbdaa'
		// 	});
		// 	$('.intro').css({
		// 		'margin-top': -($('.intro').height() / 2)
		// 	});
		// });
	</script>

</body>
</html>